<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">

<section class="content-header"><h1>采购计划导出列表</h1></section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm" onsubmit="return false;">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group">
                                    <label>项目编号</label>
                                    <!--<input type="text" name="sppProjectCode" class="form-control" placeholder="请输入项目编号">-->
                                    <input type="hidden" style="display: none" name="sppProjectCodeArrayStr"/>
                                    <div class="form-control" name="sppProjectCodeArraySelect"
                                         style="OVERFLOW-Y: auto; OVERFLOW-X:hidden;width: 196px!important; display: inline-block; height:34px!important;-webkit-border-radius: 0 !important;-moz-border-radius: 0 !important;border-radius: 0 !important;width: 196px!important;">
                                    </div>
                                    <lable>
                                        <button type="button"
                                                class="btn-success btn-xs"
                                                style="
                                                font-weight: 900;
                                                border-radius: 5px"
                                                name="addSppProjectCodeArraySelect"><i
                                                class="glyphicon glyphicon-plus"></i></button>
                                        <button type="button"
                                                class="btn-danger btn-xs"
                                                style="font-weight: 900;border-radius: 5px"
                                                name="subtractSppProjectCodeArraySelect"><i
                                                class="glyphicon glyphicon-minus"></i></button>
                                    </lable>
                                </div>
                                <div class="form-group">
                                    <label>项目名称</label>
                                    <input type="text" name="sppProjectName" class="form-control" placeholder="请输入项目名称">
                                </div>
                                <div class="form-group">
                                    <label>采购物料描述</label>
                                    <input type="text" name="sppMatDesc" class="form-control" placeholder="请输入采购物料描述">
                                </div>
                                <div class="form-group">
                                    <label>提报物料描述</label>
                                    <input type="text" name="rppMatDesc" class="form-control" placeholder="请输入提报物料描述">
                                </div>
                                <div class="form-group">
                                    <label>SAP物料编码</label>
                                    <input type="text" name="sppSapCode" class="form-control" placeholder="请输入SAP物料编码">
                                </div>
                                <div class="form-group">
                                    <label>计划员</label>
                                    <input type="text" name="sppPlanner" class="form-control" placeholder="请输入计划员">
                                </div>
                                <div class="form-group" id="spiTrackCode" style="display: none">
                                    <label>导出批次号</label>
                                    <input type="text" name="spiTrackCode" class="form-control" placeholder="请输入导出批次号">
                                </div>
                                <div class="form-group">
                                    <label class="control-label">导出状态</label>
                                    <select class="form-control" name="sppStatus" title="">
                                        <option value="-3" selected>未导出</option>
                                        <option value="-4">已导出</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="control-label">库位</label>
                                    <select class="form-control" name="sppWhiId" title="">
                                        <option value="">全部</option>
                                        <option th:each="stock : ${stocks}" th:value="${stock.whiId}"
                                                th:text="${stock.whiName}"></option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label>提报日期</label>
                                    <input type="text" class="form-control datepicker" name="startTime"
                                           readonly="readonly"/>
                                    <span> 至 </span>
                                    <input type="text" class="form-control datepicker" name="endTime"
                                           readonly="readonly"/>
                                </div>
                                <button type="button" class="btn btn-success" id="btn-search">
                                    <span class="Bold">搜索</span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="box-body">
                    <div id="toolbar" class="form-inline">
                        <a shiro:hasPermission="buy:buyexport:export" id="export-a" href="javascript:void(0)"
                           class="btn btn-info pull-right" style="margin-right: 10px;margin-bottom: 10px;">
                            <span class="Bold">采购计划导出</span>
                        </a>
                    </div>
                    <table id="bootstrap-table"></table>

                    <div id="toolbar-change" class="form-inline">
                        <a shiro:hasPermission="buy:buyexport:export" id="change-export-a" href="javascript:void(0)"
                           class="btn btn-info pull-right" style="margin-right: 10px;margin-bottom: 10px;">
                            <span class="Bold">变更申请导出</span>
                        </a>
                    </div>
                    <table id="change-table"></table>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">

    var table, changeTable;
    var statusName = ["", "", "", "未导出", "已导出"];
    var href = [[@{/buy/exportBuyPlan/export}]];
    var scheduleHref = [[@{/buy/exportBuyPlan/exportSchedule}]];
    var changeHref = [[@{/buy/exportBuyPlan/change/export}]];
    var changeScheduleHref = [[@{/buy/exportBuyPlan/change/exportSchedule}]];
    /**单删项目编号*/
    function deleteSppProjectCodeArraySelect(obj) {
        var selectArr = $("#queryForm [name='sppProjectCodeArrayStr']").val().split(',');
        delete selectArr[$(obj).parent().attr("data-index")];
        var selectVal = selectArr.join(',');
        if (selectVal[selectVal.length - 1] == ',') {
            selectVal = selectVal.substring(0, selectVal.length - 1);
        }
        if (selectVal[0] == ',') {
            selectVal = selectVal.substring(1, selectVal.length);
        }
        if (selectVal.length == 0) {
            $("#queryForm [name='sppProjectCodeArraySelect']").css("width", "196px");
        }
        $("#queryForm [name='sppProjectCodeArrayStr']").val(selectVal);
        $(obj).parent().remove();
        if ($("#queryForm [name='sppProjectCodeArraySelect']").width() < 196) {
            $("#queryForm [name='sppProjectCodeArraySelect']").css("width", "196px");
        }
    }
    /** 批量撤销导入 */
    function cancel(id) {
        js.confirmPost({
            content: "确认驳回吗？",
            url: ctx + "buy/exportBuyPlan/cancel",
            data: {id: id},
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    js.modal.success(result.msg);
                    js.table.refresh(table);
                } else {
                    js.modal.warning(result.msg);
                }
            }
        });
    }
    /** 单条撤销导入 */
    function cancelSingle(id) {
        js.confirmPost({
            content: "确认驳回吗？",
            url: ctx + "buy/exportBuyPlan/cancelSingle",
            data: {id: id},
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    js.modal.success(result.msg);
                    js.table.refresh(table);
                } else {
                    js.modal.warning(result.msg);
                }
            }
        });
    }

    /** 删除变更计划 */
    function del(id) {
        js.confirmPost({
            content: "确认删除吗？",
            url: ctx + "buy/exportBuyPlan/del",
            data: {id: id},
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    js.modal.success(result.msg);
                    js.table.refresh(changeTable);
                } else {
                    js.modal.warning(result.msg);
                }
            }
        });
    }

    $(function () {
        $("title").html($("title").html()+" —— 采购计划导出");
        /**添加项目编号*/
        $("#queryForm [name='addSppProjectCodeArraySelect']").click(function () {
            js.modal.prompt("请输入要搜索的项目编号", function (result) {
                if (result != null && result != "") {
                    $("#queryForm [name='sppProjectCodeArraySelect']").css("width", "auto");
                    var idVal = $("#queryForm [name='sppProjectCodeArraySelect']").children("span").length;
                    var optionHtml = '<span data-index="' + idVal + '" data="' + result + '" style="font-size: 16px; margin: 5px;border: #8B8986 1px solid;border-radius: 5px;background-color: #e9e9e9;color: #333333;padding-left: 5px;padding-right: 5px" value="' + result + '">' + result + '' +
                        '<button onclick="deleteSppProjectCodeArraySelect(this)" onmouseover="this.style.color=\'white\';" onmouseout="this.style.color=\'#333333\';" type="button" style="outline: none;border: 0;background: transparent" name="btn_close">×</button></span>';
                    $("#queryForm [name='sppProjectCodeArraySelect']").append(optionHtml);
                    if ($("#queryForm [name='sppProjectCodeArraySelect']").width() < 196) {
                        $("#queryForm [name='sppProjectCodeArraySelect']").css("width", "196px");
                    }
                    var vals = "";
                    $("#queryForm [name='sppProjectCodeArraySelect']").children("span").each(function () {
                        vals += $(this).attr("data") + ",";
                    });
                    vals = vals.substring(0, vals.length - 1);
                    $("#queryForm [name='sppProjectCodeArrayStr']").val(vals);
                }
            })
        });

        /** 清空项目编号 */
        $("#queryForm [name='subtractSppProjectCodeArraySelect']").click(function () {
            $("#queryForm [name='sppProjectCodeSelect']").css("width", "196px");
            $("#queryForm [name='sppProjectCodeArraySelect']").empty();
            $("#queryForm [name='sppProjectCodeArrayStr']").val('');
        });

        /** 导出 */
        $("#export-a").click(function () {
            let $that = $(this)
            let arr = js.table.selectColumns(table, "sppId");
            if (arr.length < 1) {
                js.modal.alert("请选择要导出的计划");
                return;
            }
            js.modal.prompt("请编辑本次导出备注", function (result) {
                if (result == null) {
                    return;
                }
                $that.attr('disabled', true);
                if (result) {
                    // 下载第一个文件
                    window.open(href + "?remark=" + result + "&ids=" + js.arrayToString(arr, ","));
                    // 下载第二个文件附表
                    location.href = scheduleHref + "?remark=" + result + "&ids=" + js.arrayToString(arr, ",");
                    setTimeout(function () {
                        js.table.search(table);
                        $that.removeAttr('disabled');
                    }, 2000);

                } else {
                    js.modal.alert("请输入导出备注");
                    $that.attr('disabled', false);
                }
            });
        });

        /** 导出 */
        $("#change-export-a").click(function () {
            let $that = $(this)
            let arr = js.table.selectColumns(changeTable, "spcSppId");
            if (arr.length < 1) {
                js.modal.alert("请选择要导出的计划");
                return;
            }
            js.modal.prompt("请编辑本次导出备注", function (result) {
                $that.attr('disabled', true);
                if (result) {
                    window.open(changeHref + "?remark=" + result + "&ids=" + js.arrayToString(arr, ","));
                    location.href =  changeScheduleHref + "?ids=" + js.arrayToString(arr, ",");
                    setTimeout(function () {
                        js.table.search(changeTable);
                        $that.removeAttr('disabled');
                    }, 2000);
                }else {
                    js.modal.alert("请输入导出备注");
                    $that.attr('disabled', false);
                }

            });
        });

        var columns=[
            {
                checkbox: true,
                width: '30px',
                formatter: function (value, row, index) {
                    if (row.sppStatus === 3) {
                        return {disabled: false}
                    } else {
                        return {disabled: true}
                    }
                }
            },
            {
                title: '序号', width: '50px',
                formatter: function (value, row, index, field) {
                    return index + 1;
                }
            },
            {title: "物料编码", field: 'sppSapCode'},
            {
                title: "采购计划物料描述", field: 'sppMatDesc', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 130px">' + value + '</p>';
                }
            },
            {title: "采购数量", field: 'sppNum'},
            {
                title: "提报计划物料描述", field: 'rppMatDesc', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 130px">' + value + '</p>';
                }
            },
            {
                title: "标准号", field: 'rppStandardNo', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 70px">' + value + '</p>';
                }
            },
            {
                title: "品牌", field: 'rppBrand', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 50px">' + value + '</p>';
                }
            },
            {
                title: "备注", field: 'rppRemark', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 50px">' + value + '</p>';
                }
            },
            {title: "库位", field: 'whiName'},
            {
                title: "备注计划用途", field: 'sppProjectName', formatter: function (value, row, index) {
                    if (value == null) {
                        value = '';
                    }
                    return '<p  style="word-wrap: break-word;width: 90px">' + value + '</p>';
                }
            },
            {title: "使用周期", field: 'sppProjectCode'},
            {title: "业务员", field: 'sppBuyer'},
            {title: "交货周期", field: 'sppPayCycle'},
            {
                title: "导出状态", field: 'sppStatus',
                formatter: function (value, row, index, field) {
                    return statusName[value];
                }
            },
            // 采购状态，操作（撤销）（可将导入OA的状态撤销为未导入OA，即从待审批撤销为已提交）；
            {
                title: "操作",
                field: 'sppId',
                width: '100px',
                formatter: function (value, row) {
                    var actions = [];
                    if (hasP("buy:buyexport:edit") && row.sppStatus == 4) {
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancel(' + value + ')"> 导出批量撤销</a> ');
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancelSingle(' + value + ')"> 导出单条撤销</a> ');
                    }
                    return actions.join('');
                }
            },
        ];
        $("#queryForm [name='sppStatus']").on('change', function () {
            if ($("#queryForm [name='sppStatus']").val() == 4) {
                $("#bootstrap-table").bootstrapTable('destroy');
                columns = [
                    {
                        checkbox: true,
                        width: '30px',
                        formatter: function (value, row, index) {
                            if (row.sppStatus === 3) {
                                return {disabled: false}
                            } else {
                                return {disabled: true}
                            }
                        }
                    },
                    {
                        title: '序号', width: '50px',
                        formatter: function (value, row, index, field) {
                            return index + 1;
                        }
                    },
                    {title: "批次号", field: 'spiTrackCode'},
                    {title: "物料编码", field: 'sppSapCode'},
                    {title: "采购计划物料描述", field: 'sppMatDesc'},

                    {title: "采购数量", field: 'sppNum'},
                    {title: "提报计划物料描述", field: 'rppMatDesc'},
                    {title: "标准号", field: 'rppStandardNo'},
                    {title: "品牌", field: 'rppBrand'},
                    {title: "备注", field: 'rppRemark'},
                    {title: "库位", field: 'whiName'},
                    {title: "备注计划用途", field: 'sppProjectName'},
                    {title: "使用周期", field: 'sppProjectCode'},
                    {title: "业务员", field: 'sppBuyer'},
                    {title: "交货周期", field: 'sppPayCycle'},
                    {
                        title: "采购状态", field: 'sppStatus',
                        formatter: function (value, row, index, field) {
                            return statusName[value];
                        }
                    },
                    // 采购状态，操作（撤销）（可将导入OA的状态撤销为未导入OA，即从待审批撤销为已提交）；
                    {
                        title: "操作",
                        field: 'sppId',
                        width: '60px',
                        formatter: function (value, row) {
                            var actions = [];
                            if (hasP("buy:buyexport:edit") && row.sppStatus == 4) {
                                actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancel(' + value + ')"> 导出批量撤销</a> ');
                                actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancelSingle(' + value + ')"> 导出单条撤销</a> ');
                            }
                            return actions.join('');
                        }
                    },
                ];
                /** 加载表格 */
                table = js.table.init({
                    url: ctx + "buy/exportBuyPlan/list",
                    showColumns: false,
                    showExport: false,
                    pageList: [10, 15, 25, 50, 70],
                    columns:columns
                });
                $("#spiTrackCode").show();
            }else if($("#queryForm [name='sppStatus']").val()==3){
                $("#bootstrap-table").bootstrapTable('destroy');
                columns=[
                    {
                        checkbox: true,
                        width: '30px',
                        formatter: function (value, row, index) {
                            if (row.sppStatus === 3) {
                                return {disabled: false}
                            } else {
                                return {disabled: true}
                            }
                        }
                    },
                    {
                        title: '序号', width: '50px',
                        formatter: function (value, row, index, field) {
                            return index + 1;
                        }
                    },
                    {title: "物料编码", field: 'sppSapCode'},
                    {title: "采购计划物料描述", field: 'sppMatDesc'},

                    {title: "采购数量", field: 'sppNum'},
                    {title: "提报计划物料描述", field: 'rppMatDesc'},
                    {title: "标准号", field: 'rppStandardNo'},
                    {title: "品牌", field: 'rppBrand'},
                    {title: "备注", field: 'rppRemark'},
                    {title: "库位", field: 'whiName'},
                    {title: "备注计划用途", field: 'sppProjectName'},
                    {title: "使用周期", field: 'sppProjectCode'},
                    {title: "业务员", field: 'sppBuyer'},
                    {title: "交货周期", field: 'sppPayCycle'},
                    {
                        title: "采购状态", field: 'sppStatus',
                        formatter: function (value, row, index, field) {
                            return statusName[value];
                        }
                    },
                    // 采购状态，操作（撤销）（可将导入OA的状态撤销为未导入OA，即从待审批撤销为已提交）；
                    {
                        title: "操作",
                        field: 'sppId',
                        width: '60px',
                        formatter: function (value, row) {
                            var actions = [];
                            if (hasP("buy:buyexport:edit") && row.sppStatus == 4) {
                                actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancel(' + value + ')"> 导出批量撤销</a> ');
                                actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancelSingle(' + value + ')"> 导出单条撤销</a> ');                            }
                            return actions.join('');
                        }
                    },
                ];
                /** 加载表格 */
                table = js.table.init({
                    url: ctx + "buy/exportBuyPlan/list",
                    showColumns: false,
                    showExport: false,
                    pageList: [10, 15, 25, 50, 70, 100, 300],
                    columns:columns
                });
                $("#spiTrackCode").hide();
            }
        });

        /** 加载表格 */
        table = js.table.init({
            url: ctx + "buy/exportBuyPlan/list",
            showColumns: false,
            showExport: false,
            pageList: [10, 15, 25, 50, 70],
            columns: columns
        });

        /** 表格搜索 */
        $("#btn-search").click(function () {
            js.table.search(table);
            js.table.search(changeTable);
        });

        changeTable = js.table.init({
            id: "change-table",
            showColumns: false,
            pageList: [10, 15, 25, 50, 70],
            url: ctx + "buy/exportBuyPlan/change/list",
            toolbar: '#toolbar-change',
            showExport: false,
            columns: [
                {checkbox: true},
                {
                    title: '序号', width: '40',
                    formatter: function (value, row, index, field) {
                        return index + 1;
                    }
                },
                {title: "需求跟踪号", field: 'spcTrackNo'},
                {title: "计划日期", field: 'spcPlanDate'},
                {title: "物料编码", field: 'spcMatCode'},
                {title: "物料描述", field: 'spcMatDesc'},
                {title: "更改前数量", field: 'spcNum'},
                {title: "更改后数量", field: 'spcNewNum'},
                {title: "是否删除", field: 'spcDel'},
                {
                    title: "操作",
                    field: 'spcId',
                    width: '120px',
                    formatter: function (value, row) {
                        var actions = [];
                        if (row.spcImportStatus === 1 && hasP("buy:buyexport:del")) {
                            actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="del(' + value + ')"> 删除</a> ');
                        }
                        return actions.join('');
                    }
                }
            ]
        });

    });

</script>
</body>
</html>
